class Canvas {
  constructor (ctx, info) {
    this.ctx = ctx
    this.info = info
    this.l = info.map.linespace
    this.m = (info.de.screenWidth - info.grid.w * this.l) / 2
  }

  draw (map2d, barrierlist, openlist, closelist, node) {
    for(var i = 0; i < this.info.grid.w; i ++ ){
      for(var j = 0; j < this.info.grid.h; j ++ ){
        this.ctx.rect(i * this.l + this.m, j * this.l, this.l, this.l)
      }
    }
    this.ctx.setStrokeStyle('rgb(221, 221, 221)')
    this.ctx.setLineWidth(1)
    this.ctx.stroke()
    this.ctx.closePath()

    this.ctx.beginPath()
    for(var coord of barrierlist)
      this.ctx.fillRect(coord.x * this.l + this.m + 1, coord.y * this.l + 1, this.l -2, this.l - 2)
    this.ctx.fill()
    this.ctx.closePath()

    this.ctx.beginPath()
    this.ctx.setFillStyle('rgb(212, 255, 224)')
    for(var key in openlist)
      this.ctx.fillRect(openlist[key].x * this.l + this.m + 1, openlist[key].y * this.l + 1, this.l -2, this.l - 2)
    this.ctx.closePath()

    this.ctx.beginPath()
    this.ctx.setFillStyle('rgb(0, 237, 182)')
    for(var key in closelist)
      this.ctx.fillRect(closelist[key].x * this.l + this.m + 1, closelist[key].y * this.l + 1, this.l -2, this.l - 2)
    this.ctx.closePath()

    if(node != undefined){
      this.ctx.beginPath()
      this.ctx.setLineWidth(Math.floor(this.info.map.linespace / 4)+1)
      this.ctx.setStrokeStyle('rgb(204, 251, 36)')
      this.ctx.lineCap = "round";
      this.ctx.lineJoin = "round";
      this.ctx.moveTo((node.x + 0.5) * this.l + this.m, (node.y + 0.5) * this.l)
      do{
        this.ctx.lineTo((node.x + 0.5) * this.l + this.m, (node.y + 0.5) * this.l)
        node = node.parent
      }while (node != undefined)
      this.ctx.stroke()
      this.ctx.closePath()
    }
    this.ctx.draw()
  }
}

module.exports={
  Canvas
}